<template>
	<view class="pageItem">
		<view class="card">
			<view class="c_tit">{{$t('balance.paypal')}}</view>
			<!-- <view class="row">
				<view class="r_tit">paypal account</view>
				
			</view> -->
			<view class="row">
				<u--textarea confirmType="done" class="r_inp" v-model="account" :placeholder="$t('use.no_txt_tip')" count ></u--textarea>
			</view>
		
		</view>
		<view class="_footer">
			<view class="btn sub" @click="to_bind">{{$t('use.bing')}}</view>
		</view>
	</view>
</template>

<script>
	 import { mapState } from 'vuex';
	 import helper from '@/common/helper.js';
	export default {
		data() {
			return {
				account : ''
			};
		},
		computed: {
			...mapState(['hasLogin', 'userInfo'])
		},
		onLoad() {
			if(this.hasLogin){
				this.account = this.userInfo.paypal;
			}
		},
		methods:{
			to_bind(){
				if(this.account == ''){
					this.showMsg(this.$t('system.tip14'));
					return false;
				}
				
				uni.$u.throttle(this.real_bind, 1500);	
			},
			real_bind(){
				uni.showLoading({
					mask: true
				});
				helper.Timer.start();
				let url = this.site_url + 'api/auth/member/bind_tron_addr';
				let param = {
					paypal_account : this.account
				}
				this.areq(url,param,'POST').then(res=>{
					helper.Timer.stop();
					let left_time = helper.Timer.getLeftTime(2000);
					setTimeout(()=>{
						uni.hideLoading();
						if(res.code == 1){
							uni.$emit('auto_update');
							this.showMsg(this.$t('system.tip30'), 2000, true, 'success');
							setTimeout(() => {
								this.backTo();
							}, 1500);
						}else{
							this.showMsg(res.msg);
						}
					},left_time);
					
				})
				
			}
			
		}
	}
</script>

<style lang="scss">
.pageItem{
	padding-bottom: 22vw;
}

/deep/.u-textarea{
	background-color: #3a3a3a;

}
/deep/.uni-textarea-textarea{
		color : #fff;
}
.card{
	@include card_style();
	display: inline-block;
	margin-top: 4vw;
	width: 92%;
	margin-left: 4%;
	padding: 5vw;
	.c_tit{
		width: 100%;
		font-size: 4vw;
		color: $main_color5;
		font-weight: bold;
		padding-bottom: 2vw
	}
	.row{
		width: 100%;
		display: flex;
		align-items: center;
		padding: 3vw 0;
		color: $main_color5;
		border-bottom: 1rpx solid #5f5f5f;
		.r_tit{
			width: 30vw;
			font-size: 3.6vw;
			color: $main_color_s2;
			font-weight: bold;
		}
		.r_inp{
			flex: 1;
			padding: 0 2vw;
		}
		.r_btn{
			padding: 1.5vw 4vw;
			border-radius: 5vw;
			font-size: 3.5vw;
			background: $main_color_s2;
		}
	}
}
._footer{
	@include page_button();
	position: fixed;
	bottom: 0;
	height: 22vw;
	padding: 3vw 0 6vw;
	background: $main_bg_color;
}
</style>
